        function back(){
            var canvas=document.getElementById("mc");
            var ctx=canvas.getContext("2d");
            
            function fillCircle(ctx,x,y,radius,pattern){
                ctx.save();
                ctx.translate(x,y);
                ctx.fillStyle=pattern;
                ctx.beginPath();
                ctx.arc(0,0,radius,0,Math.PI*2,true);
                ctx.closePath();
                ctx.fill();
                ctx.restore();
            }
            //var radius=Math.random()*40+1;

            var ball=[
                {x:130,y:140,vx:5,vy:-6,radius:Math.random()*10+20,color:'rgb(166 182 197)'},
                {x:50,y:80,vx:-5,vy:4,radius:Math.random()*10+20,color:'rgb(220 179 212)'},
                {x:30,y:40,vx:3,vy:-7,radius:Math.random()*10+20,color:'rgb(247 231 136)'},
                {x:230,y:40,vx:-7,vy:10,radius:Math.random()*30+20,color:'pink'},
                {x:60,y:340,vx:8,vy:5,radius:Math.random()*5+20,color:'purple'},
                {x:150,y:40,vx:-7,vy:-8,radius:Math.random()*20+20,color:'pink'},
                {x:320,y:540,vx:-2,vy:10,radius:Math.random()*10+20,color:'rgb(253 160 148)'},
                {x:160,y:340,vx:7,vy:-8,radius:Math.random()*30+20,color:'purple'},
                {x:660,y:340,vx:-9,vy:-5,radius:Math.random()*20+20,color:'rgb(182 226 172)'},
                {x:660,y:340,vx:9,vy:-3,radius:Math.random()*10+20,color:'rgb(180 203 226)'},
                {x:660,y:340,vx:12,vy:8,radius:Math.random()*10+20,color:'rgb(222 185 243)'},
                {x:660,y:340,vx:8,vy:9,radius:Math.random()*10+20,color:'rgb(142 128 150)'},
                {x:660,y:340,vx:-9,vy:-18,radius:Math.random()*10+20,color:'rgb(175 232 149)'},
                ]
            function draw(){
                //ctx.save()
                
                ctx.clearRect(0,0,canvas.width,canvas.height);
                for (let i = 0; i < ball.length; i++) {
                    var rg=ctx.createRadialGradient(0,0,0,0,0,ball[i].radius);
                    rg.addColorStop(0,ball[i].color);

                    rg.addColorStop(1,"transparent");
                    ctx.save();
                    ctx.translate(ball[i].x,ball[i].y);
                    ball[i].x+=ball[i].vx;
                    ball[i].y+=ball[i].vy;
                    if (ball[i].x>=1350||ball[i].x<=30) {
                        ball[i].vx=-ball[i].vx
                        
                    }
                    if(ball[i].y>=600||ball[i].y<=30){
                        ball[i].vy=-ball[i].vy;
                    }
                    canvas.onclick=function(evt){
                        //clearTimeout(timer1);
                        for (var i = 0; i < ball.length; i++) {
                            ball[i].x=evt.clientX;
                            ball[i].y=evt.clientY;
                        }
                        
                    }
                    fillCircle(ctx,0,0,ball[i].radius,rg);

                    ctx.restore();
                }
            }
                
            draw();
            setInterval(draw,20)
    }
    export{
        back
    }